<template>
  <div class="view_page">
    <el-card class="box-card" v-loading="loading"
             element-loading-text="拼命加载中"
             element-loading-spinner="el-icon-loading"
             element-loading-background="rgba(0, 0, 0, 0.8)">
      <!--卡片头部-->
      <!--卡片头部-->
      <div slot="header" class="clearfix">
        <!--左侧-->
        <div class="left">
          <div class="back-page">
            <div class="add-back" @click="back">
              <i class="fa fa-arrow-left" aria-hidden="true"></i>
              {{
                (addtype == 'add' ? '新增' : (addtype == 'update' ? '编辑' : '查看')) + '测点'
              }}
            </div>
          </div>
<!--          <div class="menu-title back-page" @click="back">
            <i class="fa fa-arrow-left" aria-hidden="true"></i>
            {{
              (addtype == 'add' ? '新增' : (addtype == 'update' ? '编辑' : '查看')) + '测点'
            }}
          </div>-->
        </div>
        <!--右侧-->
        <div class="right">
          <el-button type="primary" size="small" @click="save()"
                     v-if="addtype!='query'">保存
          </el-button>
        </div>
      </div>
      <!--卡片内容-->
      <div class="card-centont">
        <form-common-list :from="from" :form-add-type="addtype"
                          :form-item-list="formAddItemList"
                          :form-object="detail_data"
                          @changeFormObject="updateFormObject"></form-common-list>
      </div>
    </el-card>
  </div>
</template>

<script>
import {Message} from "element-ui";
import FormCommonList from '@/pages/admin/components/form-common-list.vue';
// import CropperImage from '@/views/zhjz/components/CropperImage.vue'
export default {
  name: "measurePointAdd",
  components: {
    FormCommonList,
  },
  data() {
    return {
      from: 'measurePointAdd',
      loading: false,
      addtype: "",
      componentKey: 0,
      formAddItemList: [
        {
          key: 'name',
          label: '测点名称',
          placeholder: '请输入测点名称',
          type: 'string',
          isDisable: false,
        },
        {
          key: 'number',
          label: '测点编号',
          placeholder: '请输入测点编号',
          type: 'string',
          isDisable: false,
        },
        {
          key: 'type',
          label: '选择类型',
          placeholder: '请选择测点类型',
          type: 'select',
          isDisable: false,
        },
        {
          key: 'unit',
          label: '单位',
          placeholder: '请输入单位',
          type: 'string',
          isDisable: false,
        },
      ],
      detail_data: {
        id: -1,
      },
      initDetailData: {},
      //上传签名
      cropperModel: false,
      cropperName: '',
      livedata: {
        name: '',
        e_signature: '',
        url: ''
      }

    };
  },
  mounted() {
  },
  created() {
    this.addtype = this.$route.query.type;
    for (let i = 0; i < this.formAddItemList.length; i++) {
      let key_str = this.formAddItemList[i].key;
      if (this.detail_data[key_str] == undefined) {
        this.$set(this.detail_data, key_str, '');
      }
      if (this.formAddItemList[i].type == 'select' ||
        this.formAddItemList[i].type == 'cascader') {
        this.$set(this.detail_data, key_str + '_list', []);
      }
    }

    this.getWitnessTemplateTypeList();
    // TODO 修改页面所在tag标签名称
    let newTagVisitedViews = [];
    this.$store.state.tagsView.visitedViews.map(item => {
      if (this.$route.path == item.path) {
        item.title = (this.addtype == 'add' ? '新增' : (this.addtype == 'update' ?
            '编辑' : '查看')) +
          item.title.substr(2);
      }
      newTagVisitedViews.push(item);
    });
    this.$store.state.tagsView.visitedViews = newTagVisitedViews;
    if (this.addtype == "add") {
    } else if (this.addtype == "update" || this.addtype == "query") {
      let data = this.$route.query.data;
      let dataObj = typeof data == "string" ? JSON.parse(data) :
        this.initDetailData;
      this.detail_data = Object.assign(this.detail_data, dataObj);
      this.dealQueryObj();
      this.getQueryInfoBy(this.detail_data.id);
    }
  },
  destroyed() {
    // console.log(this.$route.path)
    // console.log(this.$store.state.tagsView.visitedViews);
    // console.log(window.history);
    // let newTagVisitedViews = this.$store.state.tagsView.visitedViews.slice(0,
    //   this.$store.state.tagsView.visitedViews.length - 1);
    // this.$store.state.tagsView.visitedViews = newTagVisitedViews;
  },
  methods: {
    dealQueryObj() {
      for (let i = 0; i < this.formAddItemList.length; i++) {
        let tp = this.formAddItemList[i];
        if (tp.type == 'file' || tp.type == 'image' || tp.type == 'pdf') {
          // TODO.start 此处根据后台返回可修改
          // let files = this.detail_data[tp.key+'_arrs'] || [];
          let files = this.detail_data[tp.key] || [];
          let resFiles = [],
            ids = [],
            urls = [];
          for (let i = 0; i < files.length; i++) {
            let id = -1,
              url = '';
            if (files[i] && files[i].id) {
              id = files[i].id;
              ids.push(id);
            }
            if (files[i] && files[i].url) {
              url = files[i].url;
              urls.push(url);
            }
            let item = {
              id: id,
              url: url,
              name: files[i].name || '',
            };
            resFiles.push(item);
          }
          this.$set(this.detail_data, tp.key + '_files', resFiles);
          this.$set(this.detail_data, tp.key + '_file_ids', ids);
          this.$set(this.detail_data, tp.key, JSON.stringify(ids));
          this.$set(this.detail_data, tp.key + '_file_urls', urls);
        }
      }
    },
    getQueryInfoBy(id) {
      let params = {
        id: id,
      };
      // supplierQuery(params).then(res => {
      //   if (res.result == 0) {
      //     this.detail_data = Object.assign(this.detail_data, res.data || {});
      //     this.livedata = res.data.e_signature
      //     this.dealQueryObj();
      //   }
      // });
    },
    updateFormObject(params) {
      this.detail_data = params.data;
      let keys = params.keys || [];
      // if (keys.indexOf('qualification') > -1) {
      //   // 修改了设备清单的文件列表
      //   this.detail_data.qualification = JSON.stringify(
      //     this.detail_data.qualification_file_ids || []);
      //   console.log('files========', this.detail_data.qualification_file_ids)
      // }
    },
    getEquipmentTypeList() {
      let params = {};
      // witnessTemplateType(params).then(res => {
      //   if (res.result == 0) {
      //     let resData = res.data || [];
      //     this.$set(this.detail_data, 'type_list', resData);
      //   }
      // });
    },
    save() {
      var _this = this;
      var datas = _this.detail_data;
      let params = {};
      // let noVerifyNullKeys = ['system_files','qualification','personnel_qualification','equipment_list'];
      let noVerifyNullKeys = [];
      for (let i = 0; i < this.formAddItemList.length; i++) {
        let tp = this.formAddItemList[i];
        this.$set(params, tp.key, datas[tp.key]);
        console.log(params)
        if (noVerifyNullKeys.indexOf(tp.key) > -1) {
          continue;
        }
        if (this.detail_data[tp.key] == '' || this.detail_data[tp.key] == '[]' ||
          !this.detail_data[tp.key]) {
          Message.warning(tp.label + "不能为空");
          return;
        }
      }

      if (_this.addtype == "add") {
        // supplierAdd(params).then(res => {
        //   if (res.result == 0) {
        //     Message.success("添加成功");
        //     _this.back();
        //   }
        // })
      } else {
        this.$set(params, 'id', datas.id);
        // supplierUpdate(params).then(res => {
        //   if (res.result == 0) {
        //     Message.success("修改成功");
        //     _this.back();
        //   }
        // })
      }
    },
    back() {
      // let newTagVisitedViews = this.$store.state.tagsView.visitedViews.filter(
      //   (item) => {
      //     return this.$route.path != item.path;
      //   });
      // this.$store.state.tagsView.visitedViews = newTagVisitedViews;
      this.$router.back();
    },
  },
};
</script>

<style></style>
